<template>
    <div class="">
        <!--滚动内容 start-->
        <el-scrollbar class="app-container-scroll-bar">
            
            <listTpml 
            ref="listTpml"          
            :data="pageData"
                @onCommand="listCommand"
            ></listTpml>
            
    </el-scrollbar>
    <!--滚动内容 end -->
        
        
        <!--弹窗内容 start-->
        <div class="app-output-window">
            
            
        </div>
        <!--弹窗内容 end-->
        
    </div>
</template>

<script>
import listTpml from "@/view/components/listTmpl"
import { apiUrls } from "@/service/swagger/ShareController";

export default {
    components: {
        listTpml,
    },
    data() {
        return {
            pageData: {
                pageTitle: "共享存储",
                // 列表table 设置
                listOption: {
                    // 列表api
                    listApi: {
                        url: apiUrls.getShareStorePage,
                        type: "POST"
                    },
                    // 表头设置
                    header: [{
                        label: "空间名",
                        html: (row) => {
                            if (row.name == "用户盘") {
                                return `<span><img style="vertical-align: middle;margin-right:10px;" src="/static/img/file/drive-32.png" />${row.name}</span>`;
                            }
                            return `<span><img style="vertical-align: middle;margin-right:10px;" src="/static/img/file/drive-windows-32.png" />${row.name}</span>`;
                        },
                        align: "left",
                        commandName: "goDetail"
                    }, {
                        label: "容量",
                        width: "",
                        html: (row) => {
                            return `<span>${row.usage}/${row.size}${row.unit}</span>`
                        }
                    }, {
                        label: "创建人",
                        width: "",
                        propName: "creator",
                    }, {
                        label: "创建日期",
                        width: "",
                        propName: "createTime",
                    }, {
                        label: "操作",
                        width: "",
                        btns: [{
                            label: "详情",
                            commandName: "goDetail"
                        }],
                        btnGroups: []
                    }]
                }
            }
        }
		},
		mounted() {
			this.$refs.listTpml.refresh()
		},
    methods: {
        listCommand(command, row, index) {
            // console.log("列表进行了操作：", command,row,index );
            if (command && this[command]) {
                this[command](row, index);
            }
        },
        goDetail(row, index) {
            console.log(1)
            this.$router.push({
                path: "gx/xq",
                query: {
                    id: row.id,
                }
            })
        }
    }
}
</script>

<style>
</style>